﻿@{
    ViewBag.Title = "Index";
    var admin = Session["Admin"] as string;
    string mensaje = ViewBag.messageSuccess as string;
}
<div class="container">
    <div class="hero-unit">
        <h1>IQ Reportes</h1>
        <p>Bienvenido a IQ reportes</p>
        @if (admin.CompareTo("1") == 0)
        {
            if (mensaje != null && mensaje.Length > 0)
            {
                <div class="alert alert-success ">
                    mensaje
                </div>
            }
            <h3>Cargar datos</h3>
            
            <form id="uploadFileForm" action="/Home/Index" method="post" enctype="multipart/form-data">
                <div id="idAlerta" class="alert">
                    <div id="idTexto" ></div>
                </div>
                <div class="row" id ="uploadFile" >
                    <div class="span4" >
                        <span class="text">Fecha : </span>
                        <span>
                            <input type="text" name="fecha" id="idFecha"/>
                        </span>
                        
                    </div>
                    <div class="span4">
                        <span>
                            <span class="text">Institución : </span>
                            @Html.DropDownList("codInstitucion")
                        </span>
                        <input type="hidden" id="idTipoSubmit"name="tipoSubmit" value="0"/>
                    </div>
                </div>
                <div class="row">
                    <div class="span6">
			            <input id="idFile" style="margin-top:5px" type="file" name="file" class="filestyle" data-icon="false" required>
		                <input id="btnValidar" type="submit" class="btn btn-primary" value="Validar"/>
                        <input id="btnSubir" type="submit" class="btn btn-primary disabled" value="Subir"/>
                    </div>                    
                </div>
                <div class="row">
                    <div class="span4">
                        <div id="idLoading"></div><div id="idLoadingText"></div>
                    </div>
                </div>
            </form>
        }
    </div>
</div>
<script src="~/Scripts/jquery.form.min.js"></script>
<script>
    $("select").change(function () { desactivarUpload(); });
    $("#idFile").change(function () { desactivarUpload(); });
    var opts = {
        lines: 9, // The number of lines to draw
        length: 5, // The length of each line
        width: 3, // The line thickness
        radius: 5, // The radius of the inner circle
        corners: 0, // Corner roundness (0..1)
        rotate: 36, // The rotation offset
        direction: 1, // 1: clockwise, -1: counterclockwise
        color: '#000', // #rgb or #rrggbb or array of colors
        speed: 0.5, // Rounds per second
        trail: 34, // Afterglow percentage
        shadow: false, // Whether to render a shadow
        hwaccel: false, // Whether to use hardware acceleration
        className: 'spinner', // The CSS class to assign to the spinner
        zIndex: 2e9,// The z-index (defaults to 2000000000)
        top: 0, // Top position relative to parent in px
        left: 0 // Left position relative to parent in px
    };
    function limpiarAlerta() {
        $("#idAlerta").css({ display: 'none' });
    }
    function mostrarAlerta(classParam, msgParam) {
        $('#idAlerta').attr('class', 'alert');
        $('#idAlerta').addClass(classParam);
        $('#idAlerta').css({ display: 'block' });
        $('#idTexto').text(msgParam);
    }
    limpiarAlerta();
    $(":file").filestyle({ icon: false });
    $('#idFecha').datepicker().on('changeDate', function (evt) {
        desactivarUpload();
    });
    $('#uploadFileForm').ajaxForm({ beforeSubmit: validate, success: showResponse });
    var spiner = null;
    function mostrarCargando(tipoParam) {
        var num = parseInt(tipoParam);
        var target = document.getElementById("idLoading");
        spiner = new Spinner(opts).spin(target);
        var msg = "Cargando archivo";
        if (num == 0) msg = "Verificando archivo";
        $('#idLoadingText').text(msg);
    }
    function stopCargando() {
        spiner.stop();
        $('#idLoadingText').empty();
    }
    function validate(formData, jqForm, options) {
        var date = $('#idFecha').val();
        if (date == '') {
            mostrarAlerta("alert-error", "Debe ingresar una fecha");
            return false;
        }
        var tipo = $("#idTipoSubmit").val();
        mostrarCargando(tipo);
        return true;
    }
    function activarUpload() {
        $('#idTipoSubmit').val(1);
        $('#btnSubir').attr('class', 'btn btn-primary');
    }
    function desactivarUpload() {
        $('#idTipoSubmit').val(0);
        $('#btnSubir').attr('class', 'btn btn-primary');
        $('#btnSubir').addClass("disabled");
    }
    function showResponse(responseText, statusText, xhr, $form) {
        //console.log("rpta" + responseText.msg + "|" + responseText.valido);
        stopCargando();
        //se cargo el archivo
        if (responseText.fin == true) {
            console.log("Fin");
            mostrarAlerta("alert-success", responseText.msg);
            desactivarUpload();
        }
        else {
            //archivo valido - no tiene problemas
            if (responseText.valido == true) {
                mostrarAlerta("alert-success", responseText.msg);
                activarUpload();
            }
            else {
                //dir no existentes en bd - pero el usuario puede grabar si desea
                if (responseText.repetido == true) {
                    mostrarAlerta("alert-error", responseText.msg);
                    activarUpload();
                }
                else {
                    //error de archivo
                    mostrarAlerta("alert-error", responseText.msg);
                    desactivarUpload();
                }
            }
        }
    }
</script>

